var vm = new Vue({
    el: '#rrapp',
    data: {
        erpGoodsPushList: [],
        page: {currentPage: 0, pageSizes: [20, 50, 100], pageSize: 20, total: 0},
        erpGoodsPushForm: {pushType: 0, pushWay: 0},
        pushFormVisible: false,
        userSearch: '',
        userList: [],
        selectUserList: {},
        access: false,
        rules: {
            pushTitle: [
                {required: true, message: '请输入标题', trigger: 'blur'},
                {min: 5, max: 50, message: '长度在 5 到 50 个字符', trigger: 'blur'}
            ],
            pushContent: [
                {required: true, message: '请输入内容', trigger: 'blur'},
                {min: 5, max: 400, message: '长度在 5 到 400 个字符', trigger: 'blur'}
            ],
            pushId: [
                {required: true, message: '请填写', trigger: 'blur'}
            ]
        },
        options: []
    },
    created() {
        this.reload()
    },
    computed: {
        pholder() {
            return this.erpGoodsPushForm.pushType == 0 ? '请输入SPU,多个逗号隔开' : '请输入优惠券ID,多个逗号隔开';
        },
    },
    methods: {
        reload() {
            var self = this;
            var params = {
                page: self.page.currentPage,
                limit: self.page.pageSize,
            };
            $.ajax({
                type: "POST",
                url: baseURL + "push/erpgoodspush/list",
                contentType: "application/json;charset=UTF-8",
                data: JSON.stringify(params),
                success: function (r) {
                    if (r.code == 0) {
                        self.page.total = r.page.totalCount;
                        self.erpGoodsPushList = r.page.list;
                        self.options = r.list.list;
                    } else {
                        alert(r.msg);
                    }
                }
            })
        },
        handleSizeChange(val) {
            this.page.pageSize = val;
            this.reload();
        },
        handleCurrentChange(val) {
            this.page.currentPage = val;
            this.reload();
        },
        filterType(value, row) {
            return row.pushType === value;
        },
        filterWay(value, row) {
            return row.pushWay === value;
        },
        saveData() {
            var self = this;
            self.$refs['erpGoodsPushForm'].validate(function (valid) {
                if (valid) {
                    self.access = true;
                }
            });
            if (!self.access) {
                return false;
            }
            var erpGoodsPushForm = self.erpGoodsPushForm;
            if (erpGoodsPushForm.pushWay == 1) {
                if (self.selectUserList.length == 0) {
                    self.$message.error('请选择用户信息');
                    return
                }

                var userId = this.selectUserList.userId;
                Vue.set(erpGoodsPushForm, 'pushTarget', userId);
            }
            if (erpGoodsPushForm.pushWay == 2) {
                var area = erpGoodsPushForm.quyu;
                Vue.set(erpGoodsPushForm, 'pushTarget', area);
            }
            $.ajax({
                type: "POST",
                url: baseURL + "push/erpgoodspush/saveInfo",
                contentType: "application/json;charset=UTF-8",
                data: JSON.stringify(self.erpGoodsPushForm),
                success: function (r) {
                    if (r.code == 0) {
                        self.reload();
                        self.$message.success('消息推送成功');
                        self.pushFormVisible = false;
                    } else {
                        self.$message.error(r.msg);
                    }
                }
            })
        },
        queryUserList() {
            var self = this;
            var param = {
                searchUser: self.userSearch
            }
            $.get(baseURL + "push/erpgoodspush/getPopUserList", param, function (r) {
                self.userList = r.list
            });
        },
        renderHeaderBtn(h, {column}) {
            var self = this;
            return h('el-button', {
                props: {
                    type: 'primary',
                    size: 'small',
                    plain: true
                },
                on: {
                    click() {
                        self.pushFormVisible = true
                    }
                }
            }, column.label)
        },
        renderHeaderInput(h, {column}) {
            var self = this;
            return h('el-input', {
                props: {
                    placeholder: '输入关键字搜索',
                    size: 'mini',
                    clearable: true
                },
                on: {
                    change(value) {
                        self.userSearch = value;
                        self.queryUserList()
                    }
                }
            })
        },
        handlePushWayChange(value) {
            if (value == 1) {
                this.queryUserList();
            }
        },
        handleCurrentChange(row, index) {
            this.selectUserList = Object.assign({}, JSON.parse(JSON.stringify(row)));
            console.log(this.selectUserList);
        }
    }
});